<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app"></div>
<script src="./demo.js"></script>
<script>

    let tree = solve();
    let app = document.getElementById('app');

    // console.log(tree)

    function render(tree, tag) {
        // console.log(tag)
        if (tag === null) return;
        let root = document.createElement(tree.tag);
        root.innerText = tree.value;

        if (Array.isArray(tree.children) && tree.children.length > 0) {
            for (let i = 0; i < tree.children.length; i++) {
                render(tree.children[i], root);
            }
        }
        tag.appendChild(root);


    }

    render(tree, app)

    console.log(app);


    const specList = [
        ["white", "black", "gold"],
        ["64GiB", "128GiB", "256GiB"],
        ['a1', 'a2'],
        ['b1', 'b2'],
    ];

    function dfs(specList, index, result) {
        if (result.length === 4) {
            return console.log(result.join('-'));
        }
        for (let i = 0; i < specList[index].length; i++) {
            result.push(specList[index][i]);
            dfs(specList, index + 1, result);
            result.pop();
        }
    }

    dfs(specList, 0, [])
</script>
</body>
</html>